<%@ page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link href="css/common.css" rel="stylesheet" type="text/css" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div class="wrap">
  <!-- main begin-->
      <form action="do/zcuser" id="myform" method="post">
        <div class="zclf login logns">
          <h1  class="blue">用户注册</h1>
          <dl>
            <dd>
              <label> <small>*</small>用户名</label>
              <input id="username" name="username" type="text" class="inputh lf" value="" onchange="checkname()" onblur="checkname()" />
              <div id="namestr" class="lf red laba">用户名要求不低于6个字符</div>
            </dd>
            <dd>
              <label> <small>*</small>密码</label>
              <input id="paasowrd"  name="paasowrd" type="text" class="inputh lf" value="" onchange="checkpaawd()" onblur="checkpaawd()" />
              <div class="lf red laba">密码要求不低于6个字符</div>
            </dd>
            <dd>
              <label> <small>*</small>身份证号</label>
              <input id="cardNo"  name="cardNo" type="text" class="inputh lf" value="" onchange="checkcardNo()" onblur="checkcardNo()" />
              <div class="lf red laba">身份证号必填</div>
            </dd>
            <dd>
              <label> <small>*</small>电话</label>
              <input id="Tel"  name="Tel" type="text" class="inputh lf" value="" onchange="checkTel()" onblur="checkTel()"/>
              <div class="lf red laba">电话号码必填</div>
            </dd>
            <dd>
              <label> <small>*</small>住址</label>
              <input id="address"  name="address"  type="text" class="inputh lf" value="" />
            </dd>
            <dd>
              <label> <small>*</small>邮政编码</label>
              <input  id="postNumber" name="postNumber"  type="text" class="inputh lf" value="" />
            </dd>
            <dd class="hegas">
              <label> <small>*</small>验证码</label>
              <input id="code"  type="text" class="inputh inputs lf" value="" />
              <span class="wordp lf"><img src="images/img2.jpg" width="96" height="27" alt="" /></span>
              <span class="blues lf"><a href="" title="">看不清</a></span>
            </dd>
            <dd class="hegas">
              <label>&nbsp;</label>
              <input name=""  type="checkbox" id="rem_u"   />
              <label for="rem_u" class="labels">我同意<span class="blues">《服务条款》</span></label>
            </dd>
            <dd class="hegas">
              <label>&nbsp;</label>
              <input name="" type="button" value="立即注册" class="spbg buttombg buttombgs f14 lf" onclick="submitzc()"/>
            </dd>
          </dl>
        </div>
      </form>
<!-- main end-->
<!-- footer begin-->

</div>
 <!--footer end-->
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">

  $(".laba").css("display","none")

  function checkname(){
    var username=$("#username").val();

    $.ajax({
      url:"http://localhost:8080/PM/do/checkusername",
      type:"POST",
      data:{
        username:username
      },
      success:function (response){
       // console.log(response)
        if (response==1){
          $("#namestr").text("用户名已存在")
          $(".laba").eq(0).css("display","block")
          flag=true
        }else {
          $("#namestr").text("用户名可用")
          $(".laba").eq(0).css("display","none")
          flag=false;
        }
      }
    })
    return flag;
  }

  function checkpaawd(){
    var password=$("#paasowrd").val();
    if (password.length>=6){
      $(".laba").eq(1).css("display","none")
      return false
    }else{
      $(".laba").eq(1).css("display","block")
      return true
    }
  }

  function checkcardNo(){
    var cardNo=$("#cardNo").val();
    if (cardNo===""){
      $(".laba").eq(2).css("display","block")
      return true
    }else {
      $(".laba").eq(2).css("display","none")
      return false
    }
  }

  function checkTel() {
    var Tel=$("#Tel").val();
    if (Tel===""){
      $(".laba").eq(3).css("display","block")
      return true
    }else {
      $(".laba").eq(3).css("display","none")
      return false
    }
  }

  function submitzc() {
    var remu=$('#rem_u').is(':checked')
    console.log(remu)
      if (checkname()){
        alert("用户名已存在")
      }else if(checkpaawd()){
        alert("密码格式错误")
      }else if(checkcardNo()){
        alert("身份证号不能为空")
      }else if(checkTel()){
        alert("手机号不能为空")
      }else if (remu!=true){
        alert("请同意服务条款")
      }else {
        $("#myform").submit();
      }
  }

</script>
</body>
</html>
